﻿
<!doctype html>
<html lang="en">
<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
	<title>炽热教育学生卡</title>

	<meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
    <meta name="viewport" content="width=device-width" />

	<link rel="apple-touch-icon" sizes="76x76" href="assets/img/apple-icon.png" />
	<link rel="icon" type="image/png" href="assets/img/favicon.png" />

	<!--     Fonts and icons     -->
    <link href="css/student_card_css1.css" rel="stylesheet" />	
    <link href="css/student_card_css2.css" rel="stylesheet" />

	<!-- CSS Files -->
    <link href="css/student_card_css3.css" rel="stylesheet" />
    <link href="css/student_card_css4.css" rel="stylesheet" />

	<!-- CSS Just for demo purpose, don't include it in your project -->
    <link href="css/student_card_css5.css" rel="stylesheet" />
</head>
<body onload ="windowInit()">

<div class="adcenter"></div>
	<div class="image-container set-full-height" style="background-image: url('student_card_bg.jpg')">
	   
	    <!--   Big container   -->
	    <div class="container">
	        <div class="row">
		        <div class="col-sm-8 col-sm-offset-2">
		            <!--      Wizard container        -->
		            <div class="wizard-container">
		                <div class="card wizard-card" data-color="purple" id="wizard">
			                <form action="" method="" id="student-add">
			                <!--        You can switch " data-color="rose" "  with one of the next bright colors: "blue", "green", "orange", "purple"        -->

		                    	<div class="wizard-header">
		                        	<h3 class="wizard-title">
		                        		学生卡
		                        	</h3>
									<h5>填写学生卡,让我们更了解你。</h5>
		                    	</div>
								<div class="wizard-navigation">
									<ul>
			                            <li><a href="#location" data-toggle="tab">基本信息</a></li>
			                            <li><a href="#type" data-toggle="tab">性别</a></li>
			                            <li><a href="#facilities" data-toggle="tab">联系方式</a></li>
			                            <li><a href="#description" data-toggle="tab">学习目的</a></li>
			                        </ul>
								</div>

		                        <div class="tab-content">
		                            <div class="tab-pane" id="location">
		                            	<div class="row">
		                                	<div class="col-sm-12">
		                                    	<h4 class="info-text"> 让我们从基本信息开始</h4>
		                                	</div>
		                                	<div class="col-sm-5 col-sm-offset-1">
		                                    	<div class="form-group label-floating">
		                                        	<label class="control-label">姓名(必填)</label>
		                                        	<input type="text" class="form-control" id="name" name ="name">
		                                    	</div>
		                                	</div>
		                                	<div class="col-sm-5">
		                                    	<div class="form-group label-floating">
		                                            <label class="control-label">加入班级(必选)</label>
	                                            	<select name="class-select" id ="class-select" class="form-control">
	                                                	<option disabled="" selected=""></option>
	                                            	</select>
	                                        	</div>
		                                	</div>
		                                	<div class="col-sm-5 col-sm-offset-1">
		                                    	<div class="form-group label-floating">
		                                        	<label class="control-label">工作单位(学校)</label>
		                                        		<input type="text" class="form-control" id="school" name ="school">
		                                    	</div>
		                                	</div>
		                                	<div class="col-sm-5 ">
		                                    	<div class="form-group label-floating">
		                                        	<label class="control-label">编号(学号)</label>
		                                        		<input type="text" class="form-control" id="snumber" name ="snumber">
		                                    	</div>
		                                	</div>
                                              	<div class="col-sm-5 col-sm-offset-1">
		                                    	<div class="form-group label-floating">
		                                        	<label class="control-label">年龄</label>
		                                        		<input type="text" class="form-control" id="age" name ="age">
		                                    	</div>
		                                	</div>
		                            	</div>
		                            </div>

		                            <div class="tab-pane" id="type">
		                                <h4 class="info-text">你是男孩 or 女孩 ? </h4>
		                                <div class="row">
		                                    <div class="col-sm-10 col-sm-offset-1">
		                                        <div class="col-sm-4 col-sm-offset-2">
		                                            <div class="choice" data-toggle="wizard-radio" rel="tooltip" title="帅哥">
		                                                <input type="radio" name="gender" value="genderboy" >
		                                                <div class="icon">
		                                                    <i class="material-icons">男</i>
		                                                </div>
		                                                <h6>男</h6>
		                                            </div>
		                                        </div>
		                                        <div class="col-sm-4">
		                                            <div class="choice" data-toggle="wizard-radio" rel="tooltip" title="美女">
		                                                <input type="radio" name="gender" value="gendergirl">
		                                                <div class="icon">
		                                                    <i class="material-icons">女</i>
		                                                </div>
		                                                <h6>女</h6>
		                                            </div>
		                                        </div>
		                                    </div>
		                                </div>
		                            </div>
		                            <div class="tab-pane" id="facilities">
		                                <h4 class="info-text">请输入你的联系方式 </h4>
		                                <div class="row">
		                                    <div class="col-sm-5 col-sm-offset-1">
		                                      <div class="form-group label-floating">
		                                        	<label class="control-label">联系方式1(家长)(必填)</label>
		                                        	<input type="text" class="form-control" id="phone" name ="phone">
		                                    	</div>
		                                    </div>
		                                    <div class="col-sm-5">
		                                    	<div class="form-group label-floating">
		                                        	<label class="control-label">联系方式2(选填)</label>
		                                            <input type="text" class="form-control" id="parentnumber" name ="parentnumber">
		                                    	</div>
		                                    </div>
		                                    <div class="col-sm-5 col-sm-offset-1">
		                                    	<div class="form-group label-floating">
		                                        	<label class="control-label">QQ</label>
		                                        	<input type="text" class="form-control" id="qq" name="qq">
		                                    	</div>
		                                    </div>
		                                    <div class="col-sm-5">
		                                    	<div class="form-group label-floating">
		                                        	<label class="control-label">微信</label>
		                                        	<input type="text" class="form-control" id="wechat" name="wechat">
		                                    	</div>
	                                    	</div>
		                                </div>
		                            </div>
		                            <div class="tab-pane" id="description">
		                                <div class="row">
		                                    <h4 class="info-text">学习目标 </h4>
		                                    <div class="col-sm-6 col-sm-offset-1">
		                                        <div class="form-group label-floating">
		                                            <label class="control-label">学习目的</label>
		                                            <textarea class="form-control" placeholder="" rows="9" name="infomation" id ="infomation"></textarea>
		                                        </div>
		                                    </div>
		                                    <div class="col-sm-4">
		                                    	<div class="form-group label-floating">
		                                            <label class="control-label">例如：</label>
		                                            <p class="description">希望学习日语增加就业机会。<br />我希望考出N2。<br />我要看日本动漫出国游玩。<br /></p>
		                                        </div>
		                                    </div>
		                                </div>
		                            </div>
		                        </div>
		                        <div class="wizard-footer">
	                            	<div class="pull-right">
	                                    <input type='button' class='btn btn-next btn-fill btn-primary btn-wd' name='next' value='下一步' />
	                                    <input type='button' class='btn btn-finish btn-fill btn-primary btn-wd' name='finish' value='完成' onclick="actionAddStudentInfo()" />
	                                </div>
	                                <div class="pull-left">
	                                    <input type='button' class='btn btn-previous btn-fill btn-default btn-wd' name='previous' value='上一步' />
	                                </div>
		                            <div class="clearfix"></div>
		                        </div>
			                </form>
		                </div>
		            </div> <!-- wizard container -->
		        </div>
	        </div> <!-- row -->
	    </div> <!--  big container -->

	   <div class="footer">
	        <div class="container text-center">
	             <a href="http://www.chire.net/">炽热教育</a>
	        </div>
	    </div>
	</div>

</body>
	<!--   Core JS Files   -->
	<script src="css/student_card_js2.js" type="text/javascript"></script>
	<script src="css/student_card_js3.js" type="text/javascript"></script>
<script src="css/student_card_js4.js"></script>

	<!--  Plugin for the Wizard -->
<script src="css/student_card_js5.js"></script>
	<!--  More information about jquery.validate here: http://jqueryvalidation.org/	 -->
<script src="css/student_card_js6.js"></script>

    <script>
        (function ($) {
            $.getUrlParam = function (name) {
                var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
                var r = window.location.search.substr(1).match(reg);
                if (r != null) return unescape(r[2]); return null;
            }
        })(jQuery);

        $(':radio').clcik(function () {
            var value = $(this).vale()  //获取选中的radio的值
            alert(value);
        });

        function windowInit(){
            actionGetListInfoManager();
            getWechatInfo();
        }

        // 获取班级信息 
        function actionGetListInfoManager() {
            $.ajax({
                url: '../../ChireInter/Class/Class_List.ashx',
                data: { status: "1" },
                type: 'post',
                dataType: 'json',
                success: function (res) {
                    if (res.errCode == 200) {
                        var html = "";

                        html += "<option disabled=\"\" selected=\"\"></option>";
                        for (var i in res.data.list) {
                            html += "<option value=" + "\"" + res.data.list[i].id + "\"" + ">" + res.data.list[i].name + "</option>";
                        }
                
                        var oContent = $('#class-select')
                        oContent.html(html);
                        reloadFrom();
                    } else {
                        alert('提交失败');
                    }
                },
                error: function (err) {
                    alert('提交失败' + err);
                }
            })
        }

        // 添加学生信息
        function actionAddStudentInfo() {

                // 1. 获取code
                var code = $.getUrlParam('code');
        
                var gender = "";
               
                if ($("#genderboy").attr("checked")) {
                    gender = "男";
                }
                if ($("#gendergirl").attr("checked")) {
                    gender = "女";
                }
               
            
                var classId = $("#class-select").val();
      
                var args = $.param({
                    "gender": gender,
                    "code": code,
                    "classid":classId
                }) + "&" + $('#student-add').serialize();
                

                var name = $("#name").val();            // 姓名
                var phone = $("#phone").val();            // 家长电话
                 

                if (name.length <= 0) {
                    alert("请填写姓名");
                    return;
                }

                if (classId == '' || classId == null || classId == undefined) {
                    alert("请选择班级");
                    return;
                }
              
                if (phone.length <= 0) {
                    alert("请填写家长电话");
                    return;
                }

                $.ajax({
                    url: '../../ChireInter/Students/Students_Add.ashx',
                    data: args,
                    type: 'post',
                    dataType: 'json',
                    success: function (res) {
                        if (res.errCode == 200) {
                            var infohref = "../StudentInfo/student_info_card.html?id=" + res.data.id + "&auth_type=0";
                            window.location.href = infohref;
                            alert("添加成功");
                        } else {
                            alert("添加失败");
                        }
                    },
                    error: function (err) {

                    }
                })
            }

            function getWechatInfo() {
                var code = $.getUrlParam('code');
                var args = $.param({
                    "code": code
                })
                $.ajax({
                    url: '../../ChireInter/Wechat/wechat_auth.ashx',
                    data: args,
                    type: 'post',
                    dataType: 'json',
                    success: function (res) {
                        if (res.errCode == 200) {
                            //alert("添加成功");
                        } else {
                            //alert("添加失败");
                        }
                    },
                    error: function (err) {

                    }
                })

            }
    </script>
        

</html>
